<template>
  <div>
    <Header :type="'screening'" @tag="getList" @reset="reset">
      <div class="head-tit">
        内容筛选
      </div>
      <div class="head-operation">
        <span class="head-label">
          首次签到时间：
        </span>
        <div class="head-time">
          <el-date-picker
            v-model="timeVal"
            type="datetimerange"
            range-separator="至"
            start-placeholder="开始时间"
            end-placeholder="结束时间"
            value-format="yyyy-MM-dd HH:mm:ss"
            align="right"
            style="width:100%;"
            size="small"
          >
          </el-date-picker>
        </div>
        <span class="head-label">
          上次签到时间：
        </span>
        <div class="head-time">
          <el-date-picker
            v-model="timeVal1"
            type="datetimerange"
            range-separator="至"
            start-placeholder="开始时间"
            end-placeholder="结束时间"
            value-format="yyyy-MM-dd HH:mm:ss"
            align="right"
            style="width:100%;"
            size="small"
          >
          </el-date-picker>
        </div>
      </div>
      <div class="head-operation">
        <span class="head-label">
          手机号：
        </span>
        <el-input
          v-model="input"
          placeholder="请输入"
          size="mini"
          class="head-input"
        >
        </el-input>
      </div>
    </Header>

    <Main :data="tableData" :footer-lock="totals > 10">
      <el-table-column prop="member__nick_name" label="用户姓名" align="center">
      </el-table-column>
      <el-table-column prop="member__phone" label="用户电话" align="center">
      </el-table-column>
      <el-table-column prop="one_time" label="首次签到时间" align="center">
      </el-table-column>
      <el-table-column prop="up_time" label="上次签到时间" align="center">
      </el-table-column>
      <el-table-column prop="day_count" label="累计签到时间" align="center">
      </el-table-column>
      <el-table-column
        prop="member__max_sign_day"
        label="最长连续签到时间"
        align="center"
      >
      </el-table-column>
      <el-table-column prop="alarm_fee" label="奖励总积分" align="center">
      </el-table-column>
      <!-- <el-table-column
          prop="alarm_fee"
          label="奖励总成长值"
          min-width>
        </el-table-column> -->
      <el-table-column prop="alarm_money" label="奖励总余额" align="center">
      </el-table-column>
      <el-table-column
        prop="alarm_coupon"
        label="奖励优惠券数量"
        show-overflow-tooltip
        align="center"
      >
      </el-table-column>
    </Main>
    <Footer :total="totals">
      <el-pagination
        :page-size="10"
        layout="prev, pager, next"
        :total="totals"
        @current-change="changes"
      >
      </el-pagination>
    </Footer>
  </div>
</template>
<script>
import { SIGINLIST } from "../service";
export default {
  data() {
    return {
      timeVal: [],
      timeVal1: [],
      tableData: [],
      input: "",
      pages: 1,
      totals: 0
    };
  },
  created() {
    this.getList();
  },
  methods: {
    changes(page) {
      this.pages = page;
      this.getList();
    },
    commentSearch() {
      this.getList();
    },
    async getList() {
      await SIGINLIST({
        stime: Date.parse(this.timeVal[0]) / 1000 || "", // Date.parse(this.timeVal[0])
        etime: Date.parse(this.timeVal[1]) / 1000 || "",
        suptime: Date.parse(this.timeVal1[0]) / 1000 || "",
        euptime: Date.parse(this.timeVal1[1]) / 1000 || "",
        phone: this.input,
        page: this.pages,
        pageshow: 10
      }).then(({ code, count, data }) => {
        if (code === 200) {
          data.map(ele => {
            ele.one_time =
              ele.one_time !== null ? this.times(parseInt(ele.one_time)) : "";
            ele.up_time =
              ele.up_time !== null ? this.times(parseInt(ele.up_time)) : "";
          });
          this.tableData = data;
          this.totals = count;
        } else {
          this.tableData = [];
        }
      });
    },
    reset() {
      this.timeVal = [];
      this.timeVal1 = [];
      this.input = "";
    },
    screening() {
      this.getList();
    },
    times(timestamp) {
      var time = new Date(timestamp * 1000);
      var year = time.getFullYear();
      var month = time.getMonth() + 1;
      var date = time.getDate();
      var hours = time.getHours();
      var minutes = time.getMinutes();
      var seconds = time.getSeconds();
      return (
        year +
        "-" +
        month +
        "-" +
        date +
        " " +
        hours +
        ":" +
        minutes +
        ":" +
        seconds
      );
    }
  }
};
</script>
<style lang="scss" scoped></style>
